<template>
  <div class="m-t-1">
    <div class="flex items-center justify-center gap-2 text-4">
      <img src="https://jwc-static.jdwxk.com/imgs/home/right.png" class="w-20%" alt="">
      <span class="alimama-dong-fang text-#CA5646">商品兑换记录</span>
      <img src="https://jwc-static.jdwxk.com/imgs/home/right.png" class="w-20% rotate-y-180" alt="">
    </div>
    <div class="m-t-2 flex flex-col gap-2 p-x-4">
      <ExchangeCard v-for="item in exchangeRecordData" :key="item.id" :data="item" />
    </div>
  </div>
</template>

<script lang="ts" setup>
import ExchangeCard from './ExchangeCard/index.vue'
import type { IOrderData } from '@/api/home/types'
import { getExchangeRecord } from '@/api/home'

const exchangeRecordData = ref<IOrderData[]>([])
async function getData() {
  const res = await getExchangeRecord({
    page: 1,
    size: 60,
    status: 1,
  })
  exchangeRecordData.value = res.data.records
}
getData()
</script>

<style lang="less" scoped></style>
